<template>
	<view class="st-customize-sticky" :style="{height: topHeight + 'px'}">
		<view class="st-customize-statusBar" :style="{height: statusHeight + 'px'}"></view>
		<view class="st-customize-header" :style="{height: headerHeight + 'px'}"><view :style="{lineHeight:headerHeight + 'px'}">{{pageTitle}}</view></view>
	</view>
</template>

<script>
	/**
	 * 需求信息
	 * 
	 */
	export default {
		name: 'stCustomizeHeader',
		data() {
			return {
				topHeight: 0,//自定义头部总高度
				statusHeight: 0,//状态栏高度
				headerHeight: 0,//自定义头部导航栏高度
				pageTitle: uni.getStorageSync('cfg_home_page_title') ? uni.getStorageSync('cfg_home_page_title') : '首页'
			};
		},
		created() {
			
			let {statusBarHeight, navBarHeight, stickyHeight} = getApp().globalData;
			
			// 自定义头部总高度
			this.topHeight = stickyHeight;
			
			//状态栏高度
			this.statusHeight = statusBarHeight;
			
			//自定义头部导航栏高度
			this.headerHeight = navBarHeight;
			
		}
	}
</script>

<style lang="scss">
	.st-customize-sticky{
		width: 100%;
		position: sticky;
		top: 0;
		left: 0;
		z-index: 111;
		background-color: $uni-bg-color;
	}
	.st-customize-statusBar{ // 状态栏样式
	  width: 100%;
	  background-color: $uni-bg-color;
	}
	.st-customize-header{
		width: 100%;
		text-align: center;
		font-size: $uni-font-size-base;
		background-color: $uni-bg-color;
	}
</style>
